<template>
    <div class="container">
        <div class="header">
            <div class="back el-icon-arrow-left" @click="back"></div>
            <div class="mui-input-row mui-search">
                <input type="search" class="mui-input-clear" placeholder="输入商家，商品名字">
            </div>
            <div class="go">搜索</div>
        </div>
        <div class="goodsList">
            <div class="title">热门搜索</div>
        </div>
    </div>
</template>

<script>
export default {
    methods: {
        back() {
            this.$router.go(-1)
        }
    }
}
</script>

<style scoped>
    /* header */
    .header {
        position: relative;
        font-weight: 700;
        padding: 11px 50px;
    }
    .back {
        position: absolute;
        top: 15px;
        left: 7px;
        width: 35px;
        height: 35px;
        font-size: 24px;
        color: #333;
    }
    .go {
        position: absolute;
        top: 15px;
        right: 7px;
        width: 32px;
        height: 28px;
        font-size: 16px;
        color: #333;
    }
    .mui-input-clear {
        background: #f8f8f8;
    }
    /* goodsList */
    .title {
        padding: 0 12px;
        font-weight: 700;
        color: #666;
    }
    .mui-input-clear {
        font-weight: 400;
        font-size: 13px!important;
        color: #666;
    }
</style>

<style>
    .header .mui-search .mui-placeholder {
        font-weight: 400;
        font-size: 13px!important;
        color: #666;
    }
</style>
